<template>
	<view class="s-container">
		<view class="bg-f padding-24 zs-box">
			<view class="flex align-center margin-b-20" @click="navTo('/pages/knowledge/classify/index')">
				<image src="../../../static/images/icon44.png" class="t-icon margin-r-12" mode="widthFix"></image>
				<view class="text-bold fs-32 margin-r-12">{{faultType}}</view>
				<image src="../../../static/images/arrow-b-1.png" class="arrow-b" mode="widthFix"></image>
			</view>
			<view class="search-box flex padding-lr-24 padding-tb-12 align-center" @click="handleFocus">
				<image src="../../../static/images/search-c2.png" mode="aspectFill" class="search-icon margin-r-24">
				</image>
				<view class="pla-ipt">搜索知识</view>
				<view class="ipt flex-1"></view>
			</view>
		</view>
		<!-- <view class="padding-lr-24 padding-tb-12 fs-28 color-a">2024年4月</view> -->
		<view class="zs-list">
			<view class="bg-f padding-24 margin-b-24"
				@click="navTo(`/pages/knowledge/detail/index?title=${item.knName}&id=${item.knId}`)"
				v-for="(item, index) in list" :key="index">
				<view class="flex align-center justify-between margin-b-24">
					<view class="fs-30 title text-ellipsis text-bold">{{item.knName}}</view>
					<text class="flex-shrink color-a fs-26">{{item.createTime}}</text>
				</view>
				<view class="align-center">
					<!-- <image src="../../../static/images/no-img.png" mode="aspectFill" class="img flex-shrink margin-r-24"></image> -->
					<image v-if="item.fileCodeUrl" :src="`${read_url}${item.fileCodeUrl}`" mode="aspectFill" class="img flex-shrink margin-r-24"></image>

				</view>
				<view class="fs-28 text-cut-3 flex-1 color-9" style="line-height: 1.5;" v-html="item.faultSolution">
				</view>
			</view>
		</view>
		<uni-load-more :status="status" v-if="list.length > 5"></uni-load-more>

		<!-- 空数据显示 -->
		<fu-empty-ui v-if="list.length == 0 && isInit"></fu-empty-ui>

		<u-tabbar :curPage="3"></u-tabbar>
	</view>
</template>

<script>
	import {
		READ_FILE_URL
	} from '@/common/config.js';
	export default {
		data() {
			return {
				page: 1,
				list: [],
				isInit: false,
				status: 'more',
				conditions: [],
				faultType: '全部知识',
				read_url: READ_FILE_URL,
			}
		},
		onLoad() {
			this.getList()
			uni.$on('selectClass', data => {
				console.log(data)
				if (data == '全部知识') {
					this.faultType = '全部知识'
					this.conditions = []
				} else {
					this.faultType = data.dictName
					this.conditions = [{
						keyName: 'faultType',
						op: 'EQ',
						val: data.faultType
					}]
				}
				this.status = 'more';
				this.page = 1;
				this.getList();
			})
		},
		onUnload() {
			uni.$off('selectClass')
		},
		onPullDownRefresh() {
			this.status = 'more';
			this.page = 1;
			this.getList();
		},
		onReachBottom() {
			if (this.status == 'more') {
				this.getList();
			}
		},
		methods: {
			navTo(path) {
				uni.navigateTo({
					url: path
				})
			},
			handleFocus() {
				uni.navigateTo({
					url: `/pages/knowledge/search/index`
				})
			},
			async getList() {
				if (this.status != 'more') return;
				this.status = 'loading';
				await uni.request({
					url: 'http://150.158.40.124:9001/apiv1/knowledge/base/queryVKnowledgeBaseListByPage',
					method: 'POST',
					header: {
						'Content-Type': 'application/json',
						'Authorization': global.token || ''
					},
					data: {
						modelCode: 'com.xframe.domain.knowledgeBase.VKnowledgeBase',
						queryKey: 'default',
						ver: "v1",
						refList: ["ALL"],
						sortDir: 'DESC',
						sortName: 'updateTime',
						pageIndex: this.page,
						pageSize: 10,
						recordCountFlag: 'true',
						conditions: this.conditions
					},
					success: res => {
						if (res.data.code == 200) {
							let total = res.data.data.recordCount
							let data = res.data.data.dataList
							if (this.page == 1) this.list = [];
							this.list = this.list.concat(data)
							if (this.list.length < total) {
								this.status = 'more';
								this.page++;
							} else {
								this.status = 'noMore';
							}
						}
						this.isInit = true;
						uni.stopPullDownRefresh();
					},
					complete() {
						uni.stopPullDownRefresh();
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.s-container {
		min-height: 100vh;
		background-color: #f3f5f8;
	}

	.zs-box {
		.t-icon {
			width: 44rpx;
		}

		.arrow-b {
			width: 22rpx;
		}

		.search-box {
			background-color: #f2f2f2;
			border-radius: 50rpx;

			.search-icon {
				width: 44rpx;
				height: 44rpx;
			}

			.pla-ipt {
				font-size: 28rpx;
				color: #b9b9b9;
			}

			.ipt {
				font-size: 28rpx;
			}
		}
	}

	.zs-list {
		.title {
			color: rgba(51, 51, 51, 0.8);
		}

		.img {
			width: 150rpx;
			height: 150rpx;
		}
	}
</style>